<!-- directive:title 自动代码生成1.5版本 表单相关代码生成 -->
<!-- directive:breadcrumb 自动化1.5 -->
<!-- 表单 -->
<div class="panel-body">
    <style type="text/css">
        .makeFrom14 input{ margin: 2px 0; padding: 0 10px;}
        .makeFrom14 select{ margin: 2px 0; padding: 0 10px;}
        .makeFrom14 .makeFrom14List1 { height: 300px; background: #8BC34A; overflow-y: hidden; overflow-x: scroll; margin: 10px 0; white-space: nowrap; border: 1px solid red; }
        .makeFrom14 .makeFrom14List1 .makeFrom14List1Item { background: antiquewhite; border: 1px solid red; width: 400px; margin: 10px; height: 260px; display: inline-table; text-align: right; }
        .makeFrom14 .makeFrom14List1::-webkit-scrollbar { width: 15px; height: 15px; background-color: #F5F5F5; }
    </style>
    <div class="row">
        <div class="col-sm-8 makeFrom14">
            <div style="background: #FFC107; border: 1px solid red;">
                表单生成器@1.5版本@liuyp
                <br />面包屑 <input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.breadcrumb">
                <br />标题 <input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.title">
                <br />读取详情接口名称 <input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.detail">
                <br />读取详情接口URL<input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.detailUrl">
                <br />提交接口名称 <input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.submit">
                <br />提交接口URL<input type="text" placeholder="" style="width:400px;" ng-model="fromObj.api.submitUrl">
                <br />操作列功能<span ng-click="addItem('formColume')" style="color:#4CAF50;"> <i class="fa fa-plus"></i> </span>
                <span ng-click="deleteItemAll('formColume')" style="color:#F44336;"> <i class="fa fa-window-close-o"></i> </span>
            </div>
            <div class="makeFrom14List1">
                <div class="makeFrom14List1Item" ng-repeat="row in fromObj.formColume track by $index">
                    <div>(只能写字母)接口字段<input type="text" placeholder="" style="width:250px;" ng-model="row.title"></div>
                    <div>(汉字字母)属性标题<input type="text" placeholder="" style="width:250px;" ng-model="row.name"></div>
                    <div>控件类型<select placeholder="" style="width:250px;" ng-model="row.type">
                        <option value="输入框">输入框</option>
                        <option value="下拉框">下拉框</option>
                        <option value="日期框">日期框</option>
                        <option value="文本域">文本域</option>
                        <option value="开关">开关</option>
                        <option value="假开关">假开关(根据条件改变)</option>
                        <option value="单选框组">单选框组</option>
                        <option value="单选">单选</option>
                        <option value="复选">复选</option>
                        <option value="枚举填写">枚举填写</option>
                        <option value="弹框处理">弹框处理</option>
                    </select></div>
                    <div>是否必填<input type="checkbox" ng-model="row.required">结尾注释<input type="checkbox" ng-model="row.backNote">换行注释<input type="checkbox" ng-model="row.bottomNote"></div>
                    <div ng-if="row.type=='输入框'">校验规则<select placeholder="" style="width:250px;" ng-model="row.validate">
                        <option value="不可使用特殊符号">不可使用特殊符号</option>
                        <option value="不可使用中文以及特殊符号">不可使用中文以及特殊符号</option>
                        <option value="请输入0-100数字或保留两位小数">请输入0-100数字或保留两位小数</option>
                        <option value="请输入0-100整数">请输入0-100整数</option>
                        <option value="请输入合理整数">请输入合理整数</option>
                    </select></div>
                    <div ng-if="row.type=='输入框'">字符长度<input type="text" placeholder="" style="width:250px;" ng-model="row.maxlength" value="20"></div>
                    <div>假数据<select placeholder="" style="width:250px;" ng-model="row.mock">
                        <option value="日期">日期</option>
                        <option value="名字">名字</option>
                        <option value="词语">词语</option>
                        <option value="id">id</option>
                        <option value="网址">网址</option>
                        <option value="数字">数字</option>
                        <option value="百分比">百分比</option>
                        <option value="金钱">金钱</option>
                        <option value="文本数组">文本数组</option>
                        <option value="对象数组">对象数组</option>
                        <option value="数字数组">数字数组</option>
                        <option value="枚举2">枚举2</option>
                        <option value="枚举3">枚举3</option>
                        <option value="文本">文本</option>
                        <option value="">空白</option>
                    </select></div>
                    <div ng-if="row.type=='单选'||row.type=='复选'"> 单复选枚举<input type="text" placeholder="" style="width:250px;" ng-model="row.option"></div>
                    <div ng-if="row.type=='下拉框'">接口名称<input type="text" placeholder="" style="width:250px;" ng-model="row.dropName"></div>
                    <div ng-if="row.type=='下拉框'">接口URL<input type="text" placeholder="" style="width:250px;" ng-model="row.dropApi"></div>
                    <div style="color:#F44336;" ng-click="removeItem('formColume', $index)"> <i class="fa fa-close"></i> </div>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <textarea style="width: 100%;height: 519px; background: #FFEB3B; border: 1px solid red;">
                {'0':'', '1':'', '2':''}
            </textarea>
        </div>
    </div>
    <button class="btn btn-success" ng-click="makeFormCodeAndReview()"> <i class="glyphicon glyphicon-plus"></i>生产表单代码 </button>
    <button class="btn btn-success" ng-disabled="!fangdai" ng-click="setFromObj()"> 恢复以往版本json </button>
    <select placeholder="请选择" style="width:250px;" ng-model="fangdai"> <option ng-repeat="row in fangdaiArr track by $index" value="row.name">{{ row.name }}</option> </select>
    <uib-tabset class="tab-container">
        <uib-tab heading="生成的表单 预览">
            <div id="jsonMakeFrom"></div>
        </uib-tab>
        <uib-tab heading="生成的表单 Dom">
            <pre id="templateF"></pre>
        </uib-tab>
        <uib-tab heading="生成的表单 Js">
            <pre>app.controller('controllerName', function ($scope, $rootScope, $timeout, $stateParams, $uibModal, $alert, $API, $go, $rule, throttleSubmit) {})</pre>
            <pre id="templateJ"></pre>
        </uib-tab>
        <uib-tab heading="生成的API code">
            <pre id="templateA"></pre>
        </uib-tab>
        <uib-tab heading="JSON code">
            <dc-json json="fromObj" collapsed="true"></dc-json>
        </uib-tab>
    </uib-tabset>
</div>
